<%@ page import="model.User" %>
<%@ page import="java.util.List" %><%--
  Created by IntelliJ IDEA.
  User: 12138
  Date: 2020/12/22
  Time: 14:36
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="UTF-8">
    <title>管理界面</title>
    <link rel="stylesheet" type="text/css" href="css/style_management.css">
    <link rel="stylesheet" type="text/css" href="css/common_management.css">
</head>
<body>
<%
    int[][] zanRead=(int[][])session.getAttribute("zanReadData");
    int[] zan=new int[12];
    int[] read=new int[12];
    for(int i=0;i<12;i++){
        switch (zanRead[i][2]){
            case 1:zan[0]=zanRead[i][0];
                    read[0]=zanRead[i][1];
                break;
            case 2:zan[1]=zanRead[i][0];
                read[1]=zanRead[i][1];
                break;
            case 3:zan[2]=zanRead[i][0];
                read[2]=zanRead[i][1];
                break;
            case 4:zan[3]=zanRead[i][0];
                read[3]=zanRead[i][1];
                break;
            case 5:zan[4]=zanRead[i][0];
                read[4]=zanRead[i][1];
                break;
            case 6:zan[5]=zanRead[i][0];
                read[5]=zanRead[i][1];
                break;
            case 7:zan[6]=zanRead[i][0];
                read[6]=zanRead[i][1];
                break;
            case 8:zan[7]=zanRead[i][0];
                read[7]=zanRead[i][1];
                break;
            case 9:zan[8]=zanRead[i][0];
                read[8]=zanRead[i][1];
                break;
            case 10:zan[9]=zanRead[i][0];
                read[9]=zanRead[i][1];
                break;
            case 11:zan[10]=zanRead[i][0];
                read[10]=zanRead[i][1];
                break;
            case 12:zan[11]=zanRead[i][0];
                read[11]=zanRead[i][1];
                break;
        }
    }
    for (int a:
         zan) {
        System.out.println(a);
    }
%>
<%
    User user=(User) session.getAttribute("user");
    System.out.println("登录者："+user.getUsername());
%>

<%
    String status=(String)session.getAttribute("status");
    String msg=(String)session.getAttribute("msg");
    System.out.println("status:"+status);
    System.out.println("msg:"+msg);
    if("0".equals(status)){%>
<script>
    alert("${msg}")
</script>
<% }
    if("1".equals(status)){
%>
<script type="text/javascript">
    alert("${msg}");
</script>
<% }
    status="";
%>
<div id="head">
    <h1>用户后台</h1>
    <ul id="headButton">
        <li class="icon-sk011">用户：<%=user.getUsername()%></li>
        <li id="li_out" class="icon-sk012">退出后台</li>
    </ul>
</div>
<div id="left">
    <ul class="nav">
        <li class="current">
            <h4 class="title"><i class="icon-sk005"></i><a href="javascript:;">文章维护</a></h4>
            <ul hidden="true">
                <li><a id="a_essay_manage">管理文章</a></li>
                <li><a  id="a_essay_new">创作文章</a></li>
            </ul>
        </li>
        <li class="current">
            <h4 class="title"><i class="icon-sk007"></i><a href="javascript:;">基础数据</a></h4>
            <ul hidden="true">
                <li><a id="a_zan_sum">点赞量</a></li>
                <li><a id="a_read_sum">阅读量</a></li>
            </ul>
        </li >
        <li class="current">
            <h4 class="title"><i class="icon-sk057"></i><a href="javascript:;">其他</a></h4>
            <ul hidden="true">
                <li><a id="a_about_us">关于我们</a></li>
            </ul>
        </li>
    </ul>
</div>
<div id="main">
    <div class="main_content" id="welcome"><h1>欢迎进入仓颉微博用户管理后台</h1></div>
    <div class="main_content" id="essay_manage" >

        <div id="table_data" >
            <div class="table" style="width:95%; height:500px;overflow-y: auto;margin: 0 auto;text-align:center">
                <table id="DataTable"  width="100%" cellspacing="0" cellpadding="0" style="text-align: center" >
                    <thead class="table_head" >
                    <tr>
                        <th width="5%" style="text-align: center">文章ID</th>
                        <th width="30%" style="text-align: center">文章标题</th>
                        <th width="20%" style="text-align: center">创建时间</th>
                        <th width="20%" style="text-align: center">修改时间</th>
                        <th width="5%" style="text-align: center">分类</th>
                        <th width="20%" style="text-align: center">操作</th>
                    </tr>
                    </thead>
                    <tbody id="DataTableInput">
                    <tr class="item" >
                        <td> 1</td>
                        <td>你不一定全知道的四种Python装饰器实现详解</td>
                        <td>2020-12-12|00:00:00</td>
                        <td>2000</td>
                        <td><a name="UserUpdate" class="btn pill fill">修改</a> <a name="UserDelete" class="btn pill fill">删除</a></td>
                    </tr>

                    </tbody>
                </table>

            </div>
        </div>

    </div>
    <div class="main_content" id="essay_new" >
        <form method="post" action="/QM_war_exploded/EssayNew">
            <input type="hidden" name="uid" value="<%=user.getUid()%>">
        <table id="essay_new_table">
            <tr><td>文章标题：</td><td><input type="text" name="EssayTitle"></td></tr>
            <tr>
                <td>文章分类：</td>
                <td>
                    <input type="radio" name="essay_class" value="技术"/>技术
                    <input type="radio" name="essay_class" value="新闻"/>新闻
                    <input type="radio" name="essay_class" value="人物"/>人物
                </td>
            </tr>
            <tr> <td>文章标签：</td><td><input type="text" name="EssayLabel">格式如：#java#</td></tr>
        </table>
        <script type="text/plain" id="myEditor" style="width:1000px;height:200px"></script>
        <br>
        <input type="submit" id="essay_new_submit" class="btn pill fill " value="提交" >
        </form>
    </div>
    <div class="main_content" id="essay_update" >
        <form method="post" action="/QM_war_exploded/EssayUpdate">
            <input type="hidden" name="uid" value="<%=user.getUid()%>">
            <input type="hidden" id="updateEid" name="eid" value="">
            <table id="essay_update_table">
                <tr><td>文章标题：</td><td><input class="EssayTitle" type="text" name="EssayTitle"></td></tr>
                <tr>
                    <td>文章分类：</td>
                    <td>
                        <input type="radio" id="class1" class="essay_class" name="essay_class" value="技术"/>技术
                        <input type="radio" id="class2" class="essay_class" name="essay_class" value="新闻"/>新闻
                        <input type="radio" id="class3" class="essay_class" name="essay_class" value="人物"/>人物
                    </td>
                </tr>
            </table>
            <script type="text/plain" id="myEditor1" style="width:1000px;height:200px"></script>
            <br>
            <input type="submit" id="essay_update_submit" class="btn pill fill " value="提交" >
            <button type="button" id="essay_update_cancel" class="btn pill fill ">取消</button>
        </form>
    </div>
    <div class="main_content" id="zan_sum" >
        <div class="echarts" id="zan_sum_view" style="height:300px; width: 1000px"></div>
    </div>
    <div class="main_content" id="read_sum" >
        <div class="echarts" id="read_sum_view" style="height:300px; width: 1000px"></div>
    </div>
    <div class="main_content" id="about_us" >

        <p class="about"> <img src="img/about.gif"><br> 联系方式↓<br>
            客服热线：0577-88352156<br>
            qq邮箱：387617119@qq.com</p>
    </div>
</div>
<div id="bottom">
    <p >Copyright©2020 仓颉博客版权所有</p>
</div>

</body>

<script src="${pageContext.request.contextPath }/js/echarts.min.js" charset="utf-8"></script>
<script src="${pageContext.request.contextPath }/js/jquery-3.5.1.js" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath }/js/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath }/js/editor_api.js"></script>
<script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath }/js/zh-cn.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        //折线图实现代码
        // 基于准备好的dom，初始化echarts实例
        var myChart = echarts.init(document.getElementById('read_sum_view'));

        var option = {
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'cross',
                    crossStyle: {
                        color: '#999'
                    }
                }
            },
            toolbox: {
                feature: {
                    dataView: {show: true, readOnly: false},
                    magicType: {show: true, type: ['line', 'bar']},
                    restore: {show: true},
                    saveAsImage: {show: true}
                }
            },
            legend: {
                data: ['阅读量']
            },
            xAxis: [
                {
                    type: 'category',
                    data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
                    axisPointer: {
                        type: 'shadow'
                    }
                }
            ],
            yAxis: [
                {
                    type: 'value',
                    name: '阅读量',
                    min: 0,
                    max:1000,
                    interval: 100,
                    axisLabel: {
                        formatter: '{value} 次'
                    }
                }
            ],
            series: [
                {
                    name: '阅读量',
                    type: 'line',
                    data: [<%=read[0]%>, <%=read[1]%>, <%=read[2]%>,<%=read[3]%>, <%=read[4]%>, <%=read[5]%>,<%=read[6]%>,<%=read[7]%>,<%=read[8]%>,<%=read[9]%>,<%=read[10]%>,<%=read[11]%>]
                }
            ]
        };

        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
        var myChart1 = echarts.init(document.getElementById('zan_sum_view'));

        var option1 = {
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'cross',
                    crossStyle: {
                        color: '#999'
                    }
                }
            },
            toolbox: {
                feature: {
                    dataView: {show: true, readOnly: false},
                    magicType: {show: true, type: ['line', 'bar']},
                    restore: {show: true},
                    saveAsImage: {show: true}
                }
            },
            legend: {
                data: ['赞的数量']
            },
            xAxis: [
                {
                    type: 'category',
                    data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
                    axisPointer: {
                        type: 'shadow'
                    }
                }
            ],
            yAxis: [
                {
                    type: 'value',
                    name: '赞的数量',
                    min: 0,
                    max:1000,
                    interval: 100,
                    axisLabel: {
                        formatter: '{value} 个'
                    }
                }
            ],
            series: [
                {
                    name: '赞的数量',
                    type: 'line',
                    data: [<%=zan[0]%>, <%=zan[1]%>, <%=zan[2]%>,<%=zan[3]%>, <%=zan[4]%>, <%=zan[5]%>,<%=zan[6]%>,<%=zan[7]%>,<%=zan[8]%>,<%=zan[9]%>,<%=zan[10]%>,<%=zan[11]%>]
                }
            ]
        };

        // 使用刚指定的配置项和数据显示图表。
        myChart1.setOption(option1);
        //折线图实现代码


        var ue1= UE.getEditor('myEditor');
        var ue2= UE.getEditor('myEditor1');
        main_init();
        //数据变动提醒按钮效果实现
        var flag=false;
        $("#li_out").on("click",function () {
            window.location.href = "index.jsp";
        })


        //侧边菜单效果实现
        $(".nav .title").on("click",function(){
            if($(this).siblings("ul").css("display")=="block"){
                //if($(this).siblings("ul").is(:v)){
                $(this).siblings("ul").hide(500);//hide隐藏
                //$(this).children("i")//直属子标签
                $(this).find("i").removeClass("fa fa-minus-square").addClass("fa fa-plus-square");//find所有字标签
            }else{
                $(this).siblings("ul").show(500);//siblings查找同辈
                $(this).find("i").removeClass("fa fa-plus-square").addClass("fa fa-minus-square");
                $(this).parent().siblings().children("ul").hide();
                $(this).parent().siblings().children("i").removeClass("fa fa-minus-square").addClass("fa fa-plus-square");
            }
        });

        function main_init(){
            $("#welcome").show();
            $("#welcome").siblings().hide();
            $("#DataTableInput").empty();
            var str="";
            <%  List<String[]> list1=(List<String[]>) session.getAttribute("essayData");
                int index=0;
                for (String[] arr : list1) {
                        System.out.printf("{HTML}eid:%s,title:%s,create_time:%s,update_time:%s,eclass:%s,content:%s\n",arr[0],arr[1],arr[2],arr[3],arr[4],arr[5]);

                        %>
                        str= " <tr class='item' > <td class='lie1'><input type='hidden' value='<%=arr[0]%>'><%=arr[0]%></td> <td class='lie2'><input type='hidden' value='<%=arr[1]%>'><%=arr[1]%></td> <td class='lie3'><input type='hidden' value='<%=arr[2]%>'><%=arr[2]%></td> <td class='lie4'><input type='hidden' value='<%=arr[3]%>'><%=arr[3]%></td> <td class='lie4'><input type='hidden' value='<%=arr[4]%>'><%=arr[4]%></td> <td class=><a name='UserUpdate' class='btn pill fill update'>修改</a> <a name='UserDelete' class='btn pill fill del'>删除</a>"
                        str+="<form hidden='true' method='post' action='/QM_war_exploded/EssayDel' id='<%=index%>'> <input type='hidden' value='<%=user.getUid()%>' name='fromuid'><input type='hidden' value='<%=arr[0]%>' name='fromeid'> <input type='hidden' value='<%=arr[1]%>' name='fromtitle'>  <input type='hidden' value='<%=arr[4]%>' name='fromeclass'>  <input type='submit' id='sub_<%=arr[0]%>'> </form><div hidden='true'>";
                        str+='<%=arr[5]%>';
                        str+="</div></td></tr> "
                        $("#DataTableInput").append(str);
                    <%
                index++;
                }%>
        }
        $("#essay_update_cancel").on("click",function (){
            $("#essay_manage").show();
            $("#essay_manage").siblings().hide();
        })
        $(".update").on("click",function (){
            alert("修改")
            var eid=$(this).siblings('form').children("input[name='fromeid']").val();
            var title=$(this).siblings('form').children("input[name='fromtitle']").val();
            var eclass=$(this).siblings('form').children("input[name='fromeclass']").val();
            var content=$(this).siblings('div').html();
            alert(eid+"|"+title+"|"+eclass+"|"+content)
            $("#updateEid").val(eid)
            $(".EssayTitle").val(title);
            switch (eclass) {
                case "技术":
                    $(".essay_class").removeAttr("checked");
                    $("#class1").attr("checked","checked");
                    break;
                case "新闻":
                    $(".essay_class").removeAttr("checked");
                    $("#class2").attr("checked","checked");
                    break;
                case "人物":
                    $(".essay_class").removeAttr("checked");
                    $("#class3").attr("checked","checked");
                    break;
            }
            ue2.ready(function() {
                ue2.setContent(content);
            });
            $("#essay_update").show();
            $("#essay_update").siblings().hide();

            /*var title=$(this).parent().siblings('.lie2').children('input').val();
            var createtime=$(this).parent().siblings('.lie3').children('input').val();
            var eclass=$(this).parent().siblings('.lie4').children('input').val();
            alert(eid+"\\"+title+"\\"+createtime+"\\"+eclass)*/
        })
        $(".del").on("click",function (){
           // alert("删除")
            var eid=$(this).siblings('form').children("input[name='fromeid']").val();
            alert(eid)
            $(this).siblings('form').children("input[type='submit']").click();

        })
        $("#a_essay_manage").on("click",function(){
           // alert("essay_manage");
            $("#essay_manage").show();
            $("#essay_manage").siblings().hide();
        });
        $("#a_essay_new").on("click",function(){
            //alert("essay_new");
            $("#essay_new").show();
            $("#essay_new").siblings().hide();
        });
        $("#a_zan_sum").on("click",function(){
            //alert("zan_sum");
            $("#zan_sum").show();
            $("#zan_sum").siblings().hide();
        })	;
        $("#a_read_sum").on("click",function(){
           // alert("read_sum");

            $("#read_sum").show();
            $("#read_sum").siblings().hide();

        })	;
        $("#a_about_us").on("click",function(){
           // alert("about_us");
            $("#about_us").show();
            $("#about_us").siblings().hide();
        });
    });
</script>




</html>